<div [ngClass]="{ 'lv-form-control-has-error': _invalid }">
  <ng-content></ng-content>
</div>
<ng-container *ngIf="_invalid && lvErrorTip && lvErrorTipPosition ==='bottom'">
  <ng-container *ngTemplateOutlet="errorTipTpl"></ng-container>
</ng-container>

<ng-template #helpTooltipTpl>
  <div class="lv-form-control-help-tooltip">
    <ng-container *ngTemplateOutlet="errorTipTpl"></ng-container>
  </div>
</ng-template>

<ng-template #errorTipTpl>
  <div class="lv-form-control-error-default" *ngIf="lvErrorType === 'default'">
    <span>{{ _errorTip }}</span>
  </div>
  <ng-container *ngIf="lvErrorType === 'customer'">
    <ng-container *ngTemplateOutlet="lvErrorTip; context: { $implicit: formCtrl }"></ng-container>
  </ng-container>
  <ng-container *ngIf="lvErrorType === 'multiple'">
    <div class="lv-form-control-error-default" *ngFor="let item of errorTips">
      <span [ngClass]="{ 'lv-form-control-error-default-normal': !errKeys?.includes(item.key) }">{{ item.label }}</span>
    </div>
  </ng-container>
</ng-template>

<ng-container *ngIf="!_invalid && lvHelp">
  <div class="lv-form-control-help">
    <ng-container *ngTemplateOutlet="content; context: { $implicit: lvHelp }"></ng-container>
  </div>
</ng-container>

<ng-template #content let-data>
  <ng-container *ngIf="typeUtils.isRealString(data)">
    {{ data }}
  </ng-container>
  <ng-container *ngIf="typeUtils.isTemplateRef(data)">
    <ng-container *ngTemplateOutlet="data"></ng-container>
  </ng-container>
</ng-template>
